<script type="text/javascript">
var showScreenUrl = '{$ro->gen('frontend.displayScreen')}';
var loadScreenIdsUrl = '{$ro->gen('frontend.getActiveScreens')}';
var screenIds = [];
var currentScreenPos = -1;
var isLoadingScreenIds = false;
var reloadScreensTimeout = null;
var activeScreenId = -1;
var reloadScreensInterval = 1000 * {AgaviConfig::get('org.welcomescreen.frontend.data_refresh_interval')};
var cycleScreenInterval = 1000 * {AgaviConfig::get('org.welcomescreen.frontend.screen_cycle_interval')};
var nextScreenNumber = 1;

{literal}

function getNextScreenId() {
	if(nextScreenNumber == 1) {
		nextScreenNumber = 2;
		return 'screen1';
	} else {
		nextScreenNumber = 1;
		return 'screen2';
	}
}

function reloadScreenIds() {
	var xhrArgs = {
		url: loadScreenIdsUrl,
		handleAs: "text",
		preventCache: true,
		load: function(response) {
			screenIds = dojo.fromJson(response).ids;
			isLoadingScreenIds = false;
			
			if(reloadScreensTimeout) {
				window.clearTimeout(reloadScreensTimeout);
			}
			reloadScreensTimeout = window.setTimeout('reloadScreenIds();', reloadScreensInterval);
			return response;
		},
		handle: function(error) {
			isLoadingScreenIds = false;
			
			if(reloadScreensTimeout) {
				window.clearTimeout(reloadScreensTimeout);
			}
			reloadScreensTimeout = window.setTimeout('reloadScreenIds();', reloadScreensInterval);
			return error;
		}
	};
	isLoadingScreenIds = true;
	dojo.xhrGet(xhrArgs);
}

function showScreen(id) {
	if(activeScreenId == id) {
		return;
	}
	var screen = dojo.byId(getNextScreenId());
	screen.src = showScreenUrl + '?id=' + id;
	activeScreenId = id;
}

function screenTimer() {
	if(isLoadingScreenIds) {
		// do not do anything while the screen ids are reloading
		return;
	}
	++currentScreenPos;
	if(currentScreenPos >= screenIds.length) {
		currentScreenPos = 0;
	}
	
	// screenIds could be empty so check again
	if(currentScreenPos < screenIds.length) {
		showScreen(screenIds[currentScreenPos]);
	}
	
	resizeScreensToWindowSize();
}

dojo.addOnLoad(reloadScreenIds);
dojo.addOnLoad(function() {
	var screen1 = dojo.byId('screen1');
	var screen2 = dojo.byId('screen2');
	dojo.connect(screen1, 'onload', function() {
		dojo.style(screen1, 'display', 'block');
		dojo.style(screen2, 'display', 'none');
	});
	dojo.connect(screen2, 'onload', function() {
		dojo.style(screen2, 'display', 'block');
		dojo.style(screen1, 'display', 'none');
	});
});

window.setInterval('screenTimer()', cycleScreenInterval);

function windowWidth() {
	if(window.innerWidth) {
		return window.innerWidth;
	} else if(document.body && document.body.offsetWidth) {
		return document.body.offsetWidth;
	} else {
		return 0;
	}
}

function windowHeight() {
	if(window.innerHeight) {
		return window.innerHeight;
	} else if(document.body && document.body.offsetHeight) {
		return document.body.offsetHeight;
	} else {
		return 0;
	}
}

function resizeScreensToWindowSize() {
	var screen1 = dojo.byId('screen1');
	var screen2 = dojo.byId('screen2');
	var width = windowWidth() + 'px';
	var height = windowHeight() + 'px';
	dojo.style(screen1, 'width', width);
	dojo.style(screen1, 'height', height);
	dojo.style(screen2, 'width', width);
	dojo.style(screen2, 'height', height);
}
window.onresize = resizeScreensToWindowSize;

{/literal}
</script>
<iframe id="screen1" src="about:blank" style="width: 100%; height: 100%; border: none;"></iframe>
<iframe id="screen2" src="about:blank" style="width: 100%; height: 100%; border: none; display:none;"></iframe>